.tui-loadmore {
    width: 48%;
    margin: 1.5em auto;
    line-height: 1.5em;
    font-size: 24rpx;
    text-align: center;
}

.tui-loading-1 {
    margin: 0 5px;
    width: 20px;
    height: 20px;
    display: inline-block;
    vertical-align: middle;
    -webkit-animation: a 1s steps(12) infinite;
    animation: a 1s steps(12) infinite;
    background: transparent
        url()
        no-repeat;
    background-size: 100%;
}

@-webkit-keyframes a {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn);
    }
}

@keyframes a {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn);
    }
}

.tui-loadmore-tips {
    display: inline-block;
    vertical-align: middle;
}

.tui-loading-2 {
    width: 28rpx;
    height: 28rpx;
    border: 1px solid #8f8d8e;
    border-radius: 50%;
    margin: 0 6px;
    display: inline-block;
    vertical-align: middle;
    clip-path: polygon(0% 0%, 100% 0%, 100% 30%, 0% 30%);
    animation: rotate 1s linear infinite;
}

@-webkit-keyframes rotate {
    from {
        transform: rotatez(0deg);
    }

    to {
        transform: rotatez(360deg);
    }
}

@keyframes rotate {
    from {
        transform: rotatez(0deg);
    }

    to {
        transform: rotatez(360deg);
    }
}

.tui-loading-3 {
    display: inline-block;
    margin: 0 6px;
    vertical-align: middle;
    width: 28rpx;
    height: 28rpx;
    background: 0 0;
    border-radius: 50%;
    border: 2px solid;
    border-color: #e5e5e5 #e5e5e5 #e5e5e5 #8f8d8e;
    animation: tui-rotate 0.7s linear infinite;
}

.tui-loading-3.tui-loading-primary {
    border-color: #e5e5e5 #e5e5e5 #e5e5e5 #5677fc;
}

.tui-loading-3.tui-loading-green {
    border-color: #e5e5e5 #e5e5e5 #e5e5e5 #19be6b;
}

.tui-loading-3.tui-loading-orange {
    border-color: #e5e5e5 #e5e5e5 #e5e5e5 #ff7900;
}

.tui-loading-3.tui-loading-red {
    border-color: #ededed #ededed #ededed #ed3f14;
}

@-webkit-keyframes tui-rotate {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes tui-rotate {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(360deg);
    }
}
